<template>
  <div class="bgc-default pad-20">
    <h2>客服设置</h2>
    <div class="bg-color-white pad-20" style="height: 734px;">
      <el-form label-position="right" label-width="233px" class="pad-t-20">
        <el-row>
          <el-col>
            <el-form-item label="客服电话：" >
              <el-input v-model="enterprise.customerPhone" placeholder="请输入手机号"></el-input>
              <span class="font-12 font-color-9">不设置则读取基本资料的绑定手机号</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="客服微信：" >
              <el-input v-model="enterprise.wechatNum" placeholder="请输入客服微信" max="30"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-form-item label="提示说明：" >
              <el-input v-model="enterprise.workingTimeExplain" placeholder="请输入内容" max="50"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div class="bottom-bar">
      <el-button @click="$router.go(-1)">返回</el-button>
      <el-button type="primary" @click="saveEnterprise">保存</el-button>
    </div>
  </div>
</template>
<script>
  import { getEnterprise, saveEnterprise } from '@/api/user/enterprise'
  import { isvalidatePhone } from '@/utils/validate'

  export default {
    data() {
      return {
        enterpriseId: this.getEnterpriseId(),
        enterprise: {}
      }
    },
    // 初始化页面
    created() {
      this.getEnterprise()
    },
    methods: {
      getEnterprise() {
        const enterpriseId = this.enterpriseId
        getEnterprise(enterpriseId).then(response => {
          this.enterprise = response.data
          if (!this.enterprise.customerPhone) {
            this.$set(this.enterprise, 'customerPhone', this.enterprise.phone)
          }
        })
      },
      saveEnterprise() {
        if (!isvalidatePhone(this.enterprise.customerPhone)) {
          this.$message({ type: 'error', message: '手机号码输入有误' })
          return
        }
        saveEnterprise(this.enterprise).then(response => {
          if (response.isError) return
          this.$message({
            message: '保存成功',
            type: 'success'
          })
        })
      }
    }
  }

</script>
<style lang="less" scoped>
.bgc-default{
  h2{
    font-size: 20px;
    color: #666;
    line-height: 1;
    margin: 0 0 20px;
    font-weight: unset;
  }
  /deep/ .el-form-item__label{
    font-weight: unset;
  }
  /deep/.el-input__inner{
    height: 40px;
    line-height: 40px;
    width: 320px;
  }
}
.bottom-bar{
  display: flex;
  align-items: center;
  justify-content: center;
  height: 80px;
  .el-button+.el-button{
    margin-left: 30px;
  }
}
</style>
